<template>
  <div style="min-width:1200px">
    <div><img src="/img/Wonders/qijingbig.jpg" alt="" style="width:100%"></div>
    <div class="container">
      <div class="active-outer">
        <div class="active-content">
        <span>活动攻略</span>
        </div>
      </div>
      <div class="matter" v-for="(item,i) in anli" :key="i">
        <div class="matter-left">
          <router-link to="/two">{{item.title}}</router-link>
        </div>
        <div class="matter-right">
          <router-link to="/two">{{item.tishi}}</router-link>
        </div>
        <div class="matter-right">
          <router-link to="/two">{{item.journalism}}</router-link>
        </div>
        <div class="matter-right">
          <router-link to="/two">{{item.sj}}</router-link>
        </div>
      </div>
      <el-pagination
      background
      layout="prev, pager, next"
      :total="20" style="margin-top:80px; margin-left: 480px;">
      </el-pagination>
    </div>
    
  </div>
</template>
<script>
export default {
  data() {
    return {
      anli: {},
    };
  },
  mounted() {
    this.axios.get("/detail").then((result) => {
      this.anli = result.data.result;
    });
  },
};
</script>
<style scoped>
.container {
  max-width: 1100px;
  margin: 0 auto;
}
.container .active-content > span {
  color: #ff6637;
  font-size: 16px;
  font-family: "微软雅黑";
}
.container .active-outer {
  height: 50px;
  border-bottom: 1px solid #eaeaea;
  display: flex;
  align-items: center;
}
.container .active-content {
  width: 70px;
  height: 50px;
  line-height: 50px;
  border-bottom: 2px solid #ff6637;
}
.container .matter {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 50px;
  border-bottom: 2px dashed #eaeaea;
}
.container .matter .matter-left {
  width: 600px;
}
.container .matter a {
  text-decoration: none;
  color: #666666;
  font-size: 16px;
  font-family: "微软雅黑";
}
.container .matter a:hover {
  color: #ff6637;
}
.container .matter .matter-right {
  width: 100px;
  text-align: right;
}
</style>